Skip to content

Conversation

erikhfj
Copy link
Member

@erikhfj erikhfj commented Sep 8, 2026

Summary

Closes #13 (taking over from evenkkl, who is sick — get well soon!):

  • NavigationControls: props-driven { currentIndex, totalCount, onPrevious, onNext }
  • Position indicator 3 / 10 with aria-live=polite so screen readers announce position changes
  • Both buttons disabled at the ends; aria-labels (Show previous book / Show next book); visible focus-visible outline (graded a11y)
  • Plain CSS imported by the component, consistent with the app look

Tests (4 new, 23 total green)

  • Position rendering (3 / 10, 10 / 10 at the end)
  • Click → correct handler called
  • Boundary disabling: click on disabled button → handler not called (verified with rerender to both ends)
  • Snapshot

Checklist

  • npm run lint — 0 warnings
  • npm test — 23 passed
  • npm run build — passes
  • npm run format:check — passes

Note for #12/#22: once this merges, the App wiring adds useState for the index and renders NavigationControls + BookJumpList.

AI-assisted: implementation generated with AI assistance, reviewed and verified.

- src/components/NavigationControls.tsx: props-driven prev/next with
  position text (aria-live=polite), buttons disabled at the ends,
  aria-labels on both buttons, visible focus outline
- src/components/NavigationControls.css: layout, hover, focus-visible,
  disabled states
- tests: position rendering, click handlers, boundary disabling with
  rerender, snapshot

Closes #13
@erikhfj erikhfj requested a review from a team as a code owner September 8, 2026 21:18
@erikhfj erikhfj added this to the M2 — Core app milestone Sep 8, 2026
@erikhfj erikhfj added type: feature New functionality or requirement area: ui React components, presentation, navigation priority: high Required for first delivery ai-assisted Substantial AI-generated code (documented per spec) status: in-review PR is open and awaiting review labels Sep 8, 2026
@erikhfj erikhfj requested review from rachelks and robertky September 8, 2026 21:18
Copy link
Member

@rachelks rachelks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! The implementation matches the acceptance criteria, and the tests cover the navigation and boundary cases well. Tested locally and everything passes.

@rachelks rachelks merged commit b20d9d3 into main Sep 9, 2026
1 check passed
Sign in to join this conversation on GitHub.
Labels
ai-assisted Substantial AI-generated code (documented per spec) area: ui React components, presentation, navigation priority: high Required for first delivery status: in-review PR is open and awaiting review type: feature New functionality or requirement
Projects
None yet
Development

Successfully merging this pull request may close these issues.

feat: NavigationControls (prev/next with progress indicator)
2 participants